<template>
    <div>
        <bfe-form v-if="!readOnlyFlag" ref="formObj" :rules="formRules" :model="formObj" label-position="top"
            class="container">
            <div class="row">
                <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                    <bfe-form-item :label="$t('stm.regulatory.mnpltNote')" prop="mnpltNote">
                        <bfe-input v-model.trim="formObj.mnpltNote" type="textarea"
                            :placeholder="$t('stm.common.pleaseInput')" :disabled="readOnlyFlag"
                            :maxlength="2000"></bfe-input>
                    </bfe-form-item>
                </div>
            </div>
            <p style="font-weight: bold; margin-left: -15px; margin-top: 0;">{{ $t('stm.regulatory.filename') }}</p>
            <bfe-upload name="file" style="margin-top: -30px; margin-left: -15px; margin-bottom: 12px;"
                class="upload-demo" action="" :file-list="fileList" :on-preview="downloadFile" :on-remove="fileRemove"
                ref="importRef">
            </bfe-upload>
            <bfe-upload name="file" style="margin-top: -20px;" class="upload-demo" action="" :file-list="fileList2"
                :on-preview="downloadFile" :on-remove="fileRemove2" ref="importRef" />
            <div class="row" v-if="!readOnlyFlag">
                <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                    <div class="row" style="margin-left: -15px;">
                        <div class="col-xs-1">
                            <bfe-button icon="plus" class="fileButton" @click="fileUpload('file')"></bfe-button>
                            <p style="-webkit-margin-before: 0;">{{ $t('stm.regulatory.fileButton') }}</p>
                        </div>
                        <!--         <div class="col-xs-3" v-if="params.amlAigCaseSts ==='1008'">
          <bfe-button style="margin-left: 50px" icon="plus" class="fileButton" @click="fileUpload('replies')"></bfe-button>
          <p style="-webkit-margin-before: 0;">交接详情附件</p>
         </div>-->
                    </div>
                </div>
            </div>
        </bfe-form>
        <FileUpload ref="fileUpload" :dialogTableVisible.sync="dialogTableVisible" :uploadModule="'optinInfo'"
            @setFileInfo="setFileInfo"></FileUpload>
    </div>
</template>

<script>
import apisRegister from '@/views/business/stm/api/STMAPI'
import FileUpload from "@/views/business/stm/views/transAssistance/regulatoryCooperation/components/FileUpload";
import { dimsEAHS002 } from "@/utils/dimsSdk";

export default {
    props: {
        formObj: {
            type: Object,
            default: () => { }
        },
        params: {
            type: Object,
            default: () => {
                return {
                    amlAigCaseSts: ''
                }
            }
        },
        readOnlyFlag: {
            type: Boolean,
            default: false
        }
    },
    components: {
        FileUpload
    },
    data() {
        return {
            formRules: {
                mnpltNote: [{ required: false, message: this.$t('stm.common.pleaseInput'), trigger: 'blur' }],
            },
            dialogTableVisible: false,
            uploadAnnexMap: {},
            fileList: [],
            fileList2: [],
            replies: [],
            btnType: 'file'
        }
    },
    activated() {
        if (typeof (this.$refs['formObj']) !== 'undefined') {
            this.$refs['formObj'].clearValidate()
        }
    },
    methods: {
        validateForm() {
            let flag = false
            this.$refs.formObj.validate((ok) => {
                if (ok) {
                    flag = true
                } else {
                    // for(let item in this.formRules){
                    //  let flag = false
                    //  this.$refs.formObj.validateField(item, (errMsg)=>{
                    //    if(!errMsg){
                    //      flag = true
                    //    }
                    //  })
                    //  if(!flag){
                    //    const nameObj = {
                    //     mnpltNote: '处理意见',
                    //    }
                    //    const str = this.formRules[item][0]['trigger'] === 'change' ? this.$t('stm.common.pleaseSelect') : this.$t('stm.common.pleaseInput')
                    //    this.$message({
                    //      message: str + nameObj[item],
                    //      type: 'warning'
                    //    })
                    //    break
                    //  }
                    // }
                }
            })
            return flag
        },
        getTxnDt(val, str) {
            this.formObj[str] = val
            if (val) {
                this.$refs.formObj.clearValidate([str])
            }
        },
        fileUpload(val) {
            this.btnType = val
            this.dialogTableVisible = true
        },
        setFileInfo(uploadModule, file) {
            if (uploadModule === 'optinInfo') {
                if (this.btnType === 'replies') {
                    this.fileList2 = [file]
                    this.$emit('setOptionReplies', this.fileList2)
                } else {
                    this.fileList = [file]
                    this.$emit('setOptionFile', this.fileList)
                }
                this.dialogTableVisible = false
            }
        },

        downloadFile() {

        },
        fileRemove() {
            this.fileList = []
            this.$emit('setOptionFile', this.fileList)
        },
        fileRemove2() {
            this.fileList2 = []
            this.$emit('setOptionReplies', this.fileList2)
        },
    }
}
</script>

<style lang="less" scoped>
@import '../../../../style/stm.less';

.fileButton {
    padding: 8px 8px;
    font-size: 14px;
    border-radius: 2px;
    background-color: #b8b9bb;
    color: aliceblue;
}
</style>